// 布局工具类 - 处理响应式设计和屏幕适配
export class LayoutUtils {
  // 获取当前屏幕的缩放比例
  static getScaleFactor(): number {
    const gameWidth = 1280
    const gameHeight = 720
    const screenWidth = window.innerWidth
    const screenHeight = window.innerHeight
    
    const scaleX = screenWidth / gameWidth
    const scaleY = screenHeight / gameHeight
    
    // 使用较小的缩放比例以确保内容完全可见
    return Math.min(scaleX, scaleY, 1.0)
  }

  // 根据屏幕大小调整字体大小
  static getResponsiveFontSize(baseFontSize): string {
    const scale = this.getScaleFactor()
    const adjustedSize = Math.max(12, baseFontSize * scale)
    return `${Math.round(adjustedSize)}px`
  }

  // 根据屏幕大小调整间距
  static getResponsiveSpacing(baseSpacing): number {
    const scale = this.getScaleFactor()
    return Math.max(4, baseSpacing * scale)
  }

  // 检查是否为小屏幕设备
  static isSmallScreen(): boolean {
    return window.innerWidth < 1024 || window.innerHeight < 600
  }

  // 检查是否为触摸设备
  static isTouchDevice(): boolean {
    return 'ontouchstart' in window || navigator.maxTouchPoints > 0
  }

  // 获取适合当前设备的按钮大小
  static getButtonSize(): { width, height, fontSize: string } {
    const isTouch = this.isTouchDevice()
    const scale = this.getScaleFactor()
    
    if (isTouch) {
      return {
        width: Math.max(60, 80 * scale),
        height: Math.max(40, 50 * scale),
        fontSize: this.getResponsiveFontSize(16)
      }
    } else {
      return {
        width: Math.max(50, 70 * scale),
        height: Math.max(30, 40 * scale),
        fontSize: this.getResponsiveFontSize(14)
      }
    }
  }

  // 获取适合当前设备的文本样式
  static getTextStyle(baseSize, color= '#FFFFFF'): any {
    return {
      fontSize: this.getResponsiveFontSize(baseSize),
      color,
      fontFamily: 'Arial, sans-serif',
      wordWrap: this.isSmallScreen() ? { width: 600 } : undefined
    }
  }

  // 获取小组竞赛条的布局参数
  static getGroupBarLayout(): { y, height, fontSize: string } {
    const scale = this.getScaleFactor()
    const screenHeight = window.innerHeight
    
    return {
      y: Math.max(620, screenHeight - 100),
      height: Math.max(80, 100 * scale),
      fontSize: this.getResponsiveFontSize(18)
    }
  }

  // 获取顶部工具栏的布局参数
  static getToolbarLayout(): { height, fontSize: string } {
    const scale = this.getScaleFactor()
    
    return {
      height: Math.max(50, 60 * scale),
      fontSize: this.getResponsiveFontSize(14)
    }
  }

  // 居中定位辅助函数
  static centerX(gameWidth= 1280): number {
    return gameWidth / 2
  }

  static centerY(gameHeight= 720): number {
    return gameHeight / 2
  }

  // 获取安全区域边距（避免内容被遮挡）
  static getSafeMargin(): { top, bottom, left, right: number } {
    const scale = this.getScaleFactor()
    const baseMargin = 20
    
    return {
      top: Math.max(baseMargin, 60 * scale), // 为工具栏留空间
      bottom: Math.max(baseMargin, 120 * scale), // 为小组竞赛条留空间
      left: Math.max(baseMargin, baseMargin * scale),
      right: Math.max(baseMargin, baseMargin * scale)
    }
  }

  // 获取游戏内容区域的可用空间
  static getContentArea(): { x, y, width, height: number } {
    const margin = this.getSafeMargin()
    const gameWidth = 1280
    const gameHeight = 720
    
    return {
      x: margin.left,
      y: margin.top,
      width: gameWidth - margin.left - margin.right,
      height: gameHeight - margin.top - margin.bottom
    }
  }

  // 动态调整游戏对象的位置和大小
  static applyResponsiveLayout(gameObject, baseX, baseY, baseScale= 1) {
    const scale = this.getScaleFactor()
    const adjustedScale = baseScale * scale
    
    gameObject.setPosition(baseX * scale, baseY * scale)
    gameObject.setScale(adjustedScale)
    
    return gameObject
  }

  // 获取适合的选项按钮布局
  static getOptionButtonLayout(optionCount): Array<{ x, y, width, height: number }> {
    const contentArea = this.getContentArea()
    const buttonSize = this.getButtonSize()
    const spacing = this.getResponsiveSpacing(20)
    
    const totalWidth = optionCount * buttonSize.width + (optionCount - 1) * spacing
    const startX = contentArea.x + (contentArea.width - totalWidth) / 2
    const y = contentArea.y + contentArea.height * 0.6
    
    const positions = []
    for (let i = 0; i < optionCount; i++) {
      positions.push({
        x: startX + i * (buttonSize.width + spacing),
        y,
        width: buttonSize.width,
        height: buttonSize.height
      })
    }
    
    return positions
  }
}
